import Vue from 'vue'

var globalVar = '111' // eslint-disable-line
// 自己定义的不能访问
// vue有自己的白名单

new Vue({
  el: '#app',
  // {{isActive ? 'active' : 'not active'}}
  template: `
    <div v-bind:id="aaa" v-on:click="handleClick">
      {{html}}
      <p v-html="html"></p>
      <div :class="{active:isActive}" :style="styles">
        aa
      </div>
      <p>{{getJoneArr(arr)}}</p>
    </div>
  `,
  data: {
    isActive: true,
    arr: [1, 2, 3],
    html: `<span>123</span>`,
    aaa: 'main',
    styles: {
      color: 'red',
      appearance: 'none'
    }
  },
  methods: {
    handleClick () {
      alert('clicked') // eslint-disable-line
    },
    getJoneArr (arr) {
      return arr.join(' ')
    }
  }
})
